﻿
@{
    ViewBag.Title = "商品";
}
@section CSS{
    <style>
        .table td .td_img {
            width: 80px;
            height: 80px;
            float: left;
            display: block;
        }

        .table td .td_title {
            width: 228px;
            height: 100px;
            float: left;
            margin-left: 5px;
        }

            .table td .td_title b {
                display: block;
                color: red;
                margin-top: 5px;
            }
    </style>
}
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            商品
            <small>列表</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
            <li><a href="#">商品管理</a></li>
            <li class="active">商品列表</li>
        </ol>
    </section>
    <section>
        <div class="col-xs-12 ">
            <div class="box box-primary">
                <div class="box-body">
                    <div class="col-md-6 ">
                        <div class="info-box-content">
                            <span class="info-box-number"><small>总商品： </small>@ViewBag.goods_total（@ViewBag.goods1_total/<small>趣卡</small>@ViewBag.goods3_total/<small>免单</small>@ViewBag.goods2_total）</span>
                        </div>
                    </div>
                    <div class="col-md-2 ">
                        <div style="text-align:center;">
                            <span class="info-box-number">@ViewBag.goods_publish</span>
                            <span class="info-box-text" style="color:#c2c1c1;">出售中</span>
                        </div>
                    </div>
                    <div class="col-md-2 ">
                        <div style="border-left:1px #cdcdcd solid;text-align:center;">
                            <span class="info-box-number">@ViewBag.goods_no_stock</span>
                            <span class="info-box-text" style="color:#c2c1c1;">已售罄</span>
                        </div>
                    </div>
                    <div class="col-md-2 ">
                        <div style="border-left:1px #cdcdcd solid;text-align:center;">
                            <span class="info-box-number">@ViewBag.goods_no_publish</span>
                            <span class="info-box-text" style="color:#c2c1c1;">已下架</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Main content -->
    <section class="content">
        <div class="row">
            <div class="col-xs-12">
                <div class="box">
                    <div class="box-header my_search">
                        <select style="width:120px;" class="form-control" id="classSelect">
                            <option value="-1">-商品状态-</option>
                            <option value="1">上架</option>
                            <option value="0">下架</option>
                        </select>
                        <input style="width:120px;" type="text" class="form-control pull-left" id="code" placeholder="商品编号">
                        <input style="width:120px;" type="text" class="form-control pull-left" id="title" placeholder="商品名称">
                        <input style="width:120px;" type="text" class="form-control pull-left" id="category" placeholder="商品类别">
                        <input style="width:120px;" type="text" class="form-control pull-left" id="brand" placeholder="商品品牌">
                        <input style="width:120px;" type="text" class="form-control pull-left" id="shopName" placeholder="店铺名称">
                        <input type="text" style="width:120px;" class="form-control pull-left" id="startTime" placeholder="添加日期-起">
                        <span style="line-height:30px;">至</span>
                        <input type="text" style="width:120px;" class="form-control pull-left" id="endTime" placeholder="添加日期-止">
                        <button type="button" class="btn btn-default " id="btnSearch"><i class="fa fa-search"></i> 搜索</button>
                    </div>
                    <div class="box-body">
                        <table id="DataList" class="table table-bordered table-striped table-hover ">
                            <thead>
                                <tr>
                                    <th>
                                        <div align="center">
                                            <input type="checkbox" id="all_checked" />
                                        </div>
                                    </th>
                                    <th>商品编号</th>
                                    <th width="330px">商品</th>
                                    <th>商品类别</th>
                                    <th>店铺名称</th>
                                    <th>平台价</th>
                                    <th style="display:@(ViewBag.tid==1?"none":"block")">结算价</th>
                                    @*<th>销售量</th>*@
                                    <th style="display:@(ViewBag.tid==1?"block":"none")">服务费 (费率)</th>
                                    <th>市场价</th>
                                    <th>添加时间</th>
                                    <th>商品状态</th>
                                    <th style="display:@(ViewBag.tid==1?"block":"none")">是否新品</th>
                                    <th>是否置顶</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody> </tbody>
                        </table>
                    </div>
                    <!-- /.box-body -->
                </div>
                <!-- /.box -->
            </div>
            <!-- /.col -->
        </div>
        <!-- /.row -->
    </section>
    <!-- /.content -->
</div>
<!-- /.content-wrapper -->
@section JS{
    <script>
    function UpdateImgSize(id) {
        $.ajax({
            type: 'post',
            url: "/goods/GetSpecWithValue/" + id,
            data: {  },
            dataType: 'json',
            success: function (data) {
                console.log(data);
                if (data != null) {
                    if (data.img_spec.value_list != null && data.img_spec.value_list.length > 0)  {
                        $.each(data.img_spec.value_list, function (s, value) {
                            $.ajax({
                                type: 'POST',
                                url: domain + "/Tools/Create210_210Img",
                                data: { path: value.thumb_url },
                                dataType: 'json',
                                success: function (data) {
                                    //console.log(data);
                                },
                            });
                        });
                    }
                }
            },
        });
        $.ajax({
            type: 'post',
            url: "/goods/GetGoodsSkuList/" + id,
            data: {  },
            dataType: 'json',
            success: function (data) {
                console.log(data);
                if (data != null && data.length > 0)  {
                    $.each(data, function (s, value) {
                        $.ajax({
                            type: 'POST',
                            url: domain + "/Tools/Create210_210Img",
                            data: { path: value.thumb_url },
                            dataType: 'json',
                            success: function (data) {
                                //console.log(data);
                            },
                        });
                    });
                }

            },
        });
    }

        $(function () {
            //初始化表格
            GenerateTable();
            //鼠标移动到该行变色
            $('.table-hover tbody').on('click', 'tr', function () {
                if ($(this).hasClass('selected')) {
                    $(this).removeClass('selected');
                    console.log();
                }
                else {
                    u_table.$('tr.selected').removeClass('selected');
                    $(this).addClass('selected');
                }
            });
            //搜索事件
            $("#btnSearch").on("click", function () {
                var datemin = $('#startTime').val();
                var datemax = $("#endTime").val();
                if ((datemin == null && datemax != null) || (datemin != null && datemax == null)) {
                    layer.msg('请把时间填充完整!', { icon: 1, time: 1000 });
                }
                else {
                    u_table.fnDestroy();
                    GenerateTable();
                }
            });

            $('#startTime').datepicker({
                autoclose: true
            });

            $('#endTime').datepicker({
                autoclose: true
            });
        });
        var tid=@ViewBag.tid;
        //生成表格
        function GenerateTable() {
            u_table = $('#DataList').dataTable({
                "lengthChange": true,
                "searching": false,
                "ordering": false,
                "iDisplayLength": 10,
                "bProcessing": true,
                "bServerSide": true,
                "sScrollX": true,
                "bAutoWidth":false,
                "fnServerParams": function (aoData) {
                    var classSelect = $("#classSelect").val();
                    var datemin = $('#startTime').val();
                    var datemax = $("#endTime").val();
                    var title = $.trim($("#title").val());
                    var shopName = $.trim($("#shopName").val());
                    var code = $.trim($("#code").val());
                    var category = $("#category").val();
                    aoData.push(
                        { "name": "dateMin", "value": datemin },
                        { "name": "dateMax", "value": datemax },
                        { "name": "title", "value": title },
                        { "name": "shopName", "value": shopName },
                        { "name": "code", "value": code },
                        { "name": "category", "value": category },
                        { "name": "type", "value": tid },
                        { "name": "status", "value": classSelect }
                    );
                },
                "sAjaxSource": "/goods/GoodsList",
                "aoColumns": [
                    {
                        "mDataProp": 'id', "mRender": function (data, type, full) {
                            return '<div align="center"><input name="test" value="' + data + '" class="checkboxes" onclick="select1(this)" type="checkbox" /></div>';
                        }

                    },
                    { "mDataProp": 'id' },
                    //{
                    //     "mDataProp": 'name', "mRender": function (data, type, full) {
                    //         //return data.length>6?(data.substring(0,6)+"…") :data;
                    //         return data;
                    //     }
                    //},
                    {
                         "mDataProp": 'default_img', "mRender": function (data, type, full) {
                             return '<img class="td_img" src="'+(data==null||data==""?"/Content/img/wutuxiang.png":(domain+data))+'" />'
                                    +'<div class="td_title">'
                                    +'<a href = "/goods/EditGoods/' + full.id + '"  title="详情">'+full.name+'</a>'
                                    //+ '<b>￥'+full.sale_price+'</b>'
                                    +'</div>';
                         }
                     },
                    { "mDataProp": 'categoryName' },
                    { "mDataProp": 'shopName' },
                    {
                        "mDataProp": 'sale_price', "mRender": function (data, type, full) {
                            return data;
                        },
                    },
                    {
                        "mDataProp": 'settlement_price', "mRender": function (data, type, full) {
                            return data;
                        },
                        "bVisible" :  @(ViewBag.tid == 1? "false" : "true"),
                    },
                   // { "mDataProp": 'sale_count' },
                    {
                        "mDataProp": 'service_rate', "mRender": function (data, type, full) {
                            return (data*(full.sale_price/100)).toFixed(2)+" ("+full.service_rate+"%)";
                        },
                        "bVisible" :  @(ViewBag.tid == 1 ? "true" : "false"),
                    },
                   { "mDataProp": 'market_price' },
                    {
                        "mDataProp": 'add_time', "mRender": function (data, type, full) {
                            return moment(data).format("YYYY-MM-DD HH:mm:ss");
                        }
                    },
                    {
                        "mDataProp": 'published', "mRender": function (data, type, full) {
                            if (data == 1) {
                                return '<a style="text-decoration:none" class="btn btn-success" onClick="goods_noPass(this,' + full.id + ')" href="javascript:;" title="点击下架">上架</a>';
                            } else {
                                return '<a style="text-decoration:none" class="btn btn-danger" onClick="goods_pass(this,' + full.id + ')" href="javascript:;" title="点击上架">下架</a>';
                            }
                        }
                    },
                    {
                        "mDataProp": 'is_new', "mRender": function (data, type, full) {
                            if (data) {
                                return '<a style="text-decoration:none" class="btn btn-warning" onClick="goods_noNew(this,' + full.id + ')" href="javascript:;" title="点击取消新品">新品</a>';
                            } else {
                                return '<a style="text-decoration:none" class="btn btn-info" onClick="goods_new(this,' + full.id + ')" href="javascript:;" title="点击设为新品">普通</a>';
                            }
                        },
                        "bVisible" :  @(ViewBag.tid == 1 ? "true" : "false"),
                    },
                   {
                        "mDataProp": 'is_top', "mRender": function (data, type, full) {
                            if (data) {
                                return '<a style="text-decoration:none" class="btn btn-warning" onClick="goods_noTop(this,' + full.id + ')" href="javascript:;" title="点击取消置顶">置顶</a>';
                            } else {
                                return '<a style="text-decoration:none" class="btn btn-info" onClick="goods_top(this,' + full.id + ')" href="javascript:;" title="点击置顶">常规</a>';
                            }
                        }
                    },
                    {
                        "mDataProp": 'id', "mRender": function (data, type, full) {
                            return ' <a href = "/goods/EditGoods/' + full.id + '" class="btn btn-default"  title="编辑">编辑</a> ';
                            //+' | <a onclick="UpdateImgSize('+ full.id + ')" href="javascript:void(0)">矫正规格图片尺寸</a>';
                                //+'| <a  href = "/goods/GoodsPictures/' + full.id + '/0"  title="图片管理">滚动图片</a> |'
                                //+' <a href = "/goods/GoodsPictures/' + full.id + '/1"  title="图片管理">内容图片</a> |'
                                //+ ' <a href = "/goods/GoodsSpec/' + full.id + '"  title="规格管理">规格管理</a> |'
                                //+ ' <a href = "/goods/GoodsSku/' + full.id + '"  title="商品SKU">商品SKU</a> ' ;
                        }
                    }
                ],
                fnDrawCallback: function (obj) {
                            var flag1 = true;
                            $("input:checkbox[class='checkboxes']").each(function () {
                                var id = $(this).val();
                                if (contain(list, id)) {
                                    //console.log("选中" + id);
                                    $(this).prop('checked', true);
                                } else {
                                    //console.log("未选中" + id);
                                    flag1 = false;
                                }
                            });

                            $("#all_checked").prop('checked', flag1);
                        }
            });
        }

        //实现全选功能
        $("#all_checked").click(function () {
            $('[name=test]:checkbox').prop('checked', this.checked);//checked为true时为默认显示的状态
            var flag = $(this).prop('checked');
            $("input:checkbox[class='checkboxes']").each(function () {
                var id = $(this).val();
                //console.log(id);
                if (flag) {
                    if (!contain(list, id)) {
                        add(list, id);
                    }
                } else {
                    if (contain(list, id)) {
                        remove(list, id);
                    }
                }
            });
            var aaa = list.join();
            //$('#selectedIds').val(aaa)
            console.log(aaa);
        });

        /*上架*/
        function goods_pass(obj, id) {
            layer.confirm('确定上架商品？', function (index) {
                $.ajax({
                    type: "post",
                    url: "/goods/SetGoodsIsUse",
                    dataType: "json",
                    data: { id: id, isUse: 1 },
                    success: function (data) {
                        if (data.status == "y") {
                            $(obj).text("上架").attr("onClick", "goods_noPass(this," + id + ")").attr("title", "点击下架").attr("class", "btn btn-success");
                            layer.msg('已上架', { icon: 6, time: 1000 });
                        }
                        else {
                            layer.msg(data.info, { icon: 5, time: 1200 });
                        }
                    }
                });

            });
        }
        /*下架*/
        function goods_noPass(obj, id) {
            layer.confirm('确定下架商品？', function (index) {
                $.ajax({
                    type: "post",
                    url: "/goods/SetGoodsIsUse",
                    dataType: "json",
                    data: { id: id, isUse: 0 },
                    success: function (data) {
                        if (data.status == "y") {
                            $(obj).text("下架").attr("onClick", "goods_pass(this," + id + ")").attr("title", "点击上架").attr("class", "btn btn-danger");
                            layer.msg('已下架', { icon: 5, time: 1200 });
                        }
                        else {
                            layer.msg(data.info, { icon: 5, time: 1200 });
                        }
                    }
                });

            });
        }

          /*设为新品*/
        function goods_new(obj, id) {
            layer.confirm('确定设为新品？', function (index) {
                $.ajax({
                    type: "post",
                    url: "/goods/SetGoodsIsNew",
                    dataType: "json",
                    data: { id: id, isUse: 1 },
                    success: function (data) {
                        if (data.status == "y") {
                            $(obj).text("新品").attr("onClick", "goods_noNew(this," + id + ")").attr("title", "点击启用").attr("class", "btn btn-warning");
                            layer.msg('已设为新品', { icon: 6, time: 1200 });
                        }
                        else {
                            layer.msg(data.info, { icon: 5, time: 1200 });
                        }
                    }
                });

            });
        }
        /*取消新品*/
        function goods_noNew(obj, id) {
            layer.confirm('确定取消新品设置？', function (index) {
                $.ajax({
                    type: "post",
                    url: "/goods/SetGoodsIsNew",
                    dataType: "json",
                    data: { id: id, isUse: 0 },
                    success: function (data) {
                        if (data.status == "y") {
                            $(obj).text("普通").attr("onClick", "goods_new(this," + id + ")").attr("title", "点击设为新品").attr("class", "btn btn-info");
                            layer.msg('已取消', { icon: 5, time: 1200 });
                        }
                        else {
                            layer.msg(data.info, { icon: 5, time: 1200 });
                        }
                    }
                });

            });
        }

          /*置顶*/
        function goods_top(obj, id) {
            layer.confirm('确定置顶？', function (index) {
                $.ajax({
                    type: "post",
                    url: "/goods/SetGoodsIsTop",
                    dataType: "json",
                    data: { id: id, isUse: 1 },
                    success: function (data) {
                        if (data.status == "y") {
                            $(obj).text("置顶").attr("onClick", "goods_noTop(this," + id + ")").attr("title", "点击取消置顶").attr("class", "btn btn-warning");
                            layer.msg('已置顶', { icon: 6, time: 1000 });
                        }
                        else {
                            alert(data.info);
                        }
                    }
                });

            });
        }
        /*取消置顶*/
        function goods_noTop(obj, id) {
            layer.confirm('确定取消置顶？', function (index) {
                $.ajax({
                    type: "post",
                    url: "/goods/SetGoodsIsTop",
                    dataType: "json",
                    data: { id: id, isUse: 0 },
                    success: function (data) {
                        if (data.status == "y") {
                            $(obj).text("常规").attr("onClick", "goods_top(this," + id + ")").attr("title", "点击置顶").attr("class", "btn btn-info");
                            layer.msg('已取消置顶', { icon: 5, time: 1200 });
                        }
                        else {
                            layer.msg(data.info, { icon: 5, time: 1200 });
                        }
                    }
                });

            });
        }
    </script>
}

